<style lang="less">
</style>

<template>
    <div>
        <Table border :columns="columns" :data="getData" style="width: 100%;"></Table>
        <Modal v-model="showModal" :closable='false' :mask-closable=true :width="1000">
            <h3 slot="header" style="color:#2D8CF0">请选择更换项目</h3>
            <Tabs type="card">
                <TabPane label="请选择">
                    <project-list ref="projectList" v-on="{selectProject:selectProject}"></project-list>
                </TabPane>
                <TabPane :label="label">
                    <Table border :columns="columns1" :data="data1" style="width: 100%;"></Table>
                </TabPane>
                <Button type="primary" @click="doReplace" style="height: 30px" slot="extra">提交</Button>
            </Tabs>
            <div slot="footer">
            </div>
        </Modal>
        <Modal v-model="showMedical" @on-ok="doAddMedical" ok-text="保存" cancel-text="取消" :closable='false' :mask-closable=true :width="600">
            <p slot="header">
                <span>添加医嘱</span>
            </p>
            <Input v-model="medicalAdvice" type="textarea" :rows="10" :autosize="{minRows: 10}" placeholder="请输入医嘱..."></Input>
        </Modal>
    </div>
</template>
<script>
    import iviewTable from '@/view/common/table/Table.vue';
    import projectList from '@/view/business/medical/list/ProjectList.vue';
    export default {
        components: {
            iviewTable,
            projectList
        },
        props: {
            row: Object,
            details: {
                type: Array,
                default: []
            }
        },
        computed: {
            getData () {
                if (this.data.length === 0) {
                    return this.details
                } else {
                    return this.data
                }
            }
        },
        data () {
            return {
                data: [],
                label: (h) => {
                    return h('div', [
                        h('span', '已选择'),
                        h('Badge', {
                            props: {
                                count: this.data1.length
                            }
                        })
                    ])
                },
                selectRow: {},
                showModal: false,
                showMedical: false,
                medicalAdvice: '',
                index: '',
                baseURL: '/user/treat/plan/course/details',
                columns: [
                    {
                        title: '处置项目',
                        key: 'itemName'
                    },
                    {
                        title: '总治疗(次)',
                        key: 'quantity'
                    },
                    {
                        title: '已划扣(次)',
                        key: 'deduct'
                    },
                    {
                        title: '医嘱',
                        key: 'medicalAdvice',
                    },
                    {
                        title: '治疗状态',
                        key: 'status',
                        render: (h, params) => {
                            let temp = params.row.status
                            if (temp === 0) {
                                return h('div', [
                                    h('Tag', {
                                        props: {
                                            type: 'border',
                                            color: 'green'
                                        },
                                        style: {
                                        }
                                    }, '进行中')
                                ]);
                            } else if (temp === 2) {
                                return h('div', [
                                    h('Tag', {
                                        props: {
                                            type: 'border',
                                            color: 'red'
                                        },
                                        style: {
                                        }
                                    }, '已停止')
                                ]);
                            } else if (temp === 3) {
                                return h('div', [
                                    h('Tag', {
                                        props: {
                                            type: 'border',
                                            color: 'yellow'
                                        },
                                        style: {
                                        }
                                    }, '已更换')
                                ]);
                            }
                        }
                    },
                    {
                        title: '停止时间',
                        key: 'stopTime',
                        render: (h, params) => {
                            let temp = ''
                            if (params.row.creationTime) {
                                temp = this.$moment(params.row.creationTime).format('YYYY年MM月DD日')
                            }
                            return h('span', temp)
                        }
                    },
                    {
                        title: '操作',
                        width: 300,
                        align: 'center',
                        render: (h, params) => {
                            return h('div', [
                                h('Button', {
                                    props: {
                                        type: 'primary',
                                        size: 'default'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.showAddMedical(params.row, params.index)
                                        }
                                    }
                                }, '下医嘱'),
                                h('Button', {
                                    props: {
                                        type: 'error',
                                        size: 'default'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.stop(params.row, params.index)
                                        }
                                    }
                                }, '停止'),
                                h('Button', {
                                    props: {
                                        type: 'primary',
                                        size: 'default'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.replace(params.row)
                                        }
                                    }
                                }, '更换')
                            ]);
                        }
                    }
                ],
                data1: [],
                columns1: [
                    {
                        title: '项目名称',
                        key: 'name'
                    },
                    {
                        title: '项目价格',
                        key: 'price',
                        width: 150
                    },
                    {
                        title: '数量',
                        key: 'quantity',
                        width: 150,
                        render: (h, params) => {
                            var vm = this
                            return h('InputNumber',{
                                props: {
                                    min: 1,
                                    value: params.row.quantity
                                },
                                style: {
                                    width: '100%'
                                },
                                on: {
                                    'on-change' (value) {
                                        params.row.quantity = value
                                        vm.data1[params.index] = params.row
                                    }
                                }
                            });
                        }
                    },
                    {
                        title: '操作',
                        width: 150,
                        align: 'center',
                        render: (h, params) => {
                            return h('div', [
                                h('Button', {
                                    props: {
                                        type: 'error',
                                        size: 'default'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.remove(params.index)
                                        }
                                    }
                                }, '删除')
                            ]);
                        }
                    }
                ]
            }
        },
        methods: {
            showAddMedical (row, index) {
                this.index = index
                this.medicalAdvice = ''
                this.selectRow = row
                this.showMedical = true
            },
            doAddMedical () {
                this.selectRow.medicalAdvice = this.medicalAdvice
                let url = this.baseURL + '/save'
                this.$ajax.post(url, this.selectRow).then((response) => {
                    let {code, msg} = response.data
                    if (code === 0) {
                        this.$bus.alert('success', '保存成功')
                        this.data[this.index].medicalAdvice = this.medicalAdvice
                    } else {
                        this.$bus.alert('error', msg)
                    }
                })
            },
            stop (row, index) {
                if (row.status === 1) {
                    this.$Modal.confirm({
                        title: '操作提示',
                        content: '<p>是否确认停止治疗?</p>',
                        onOk: () => {
                            this.doStop(row.id, index)
                        }
                    })
                } else {
                    this.$bus.alert('warning', '不符合停止条件')
                }
            },
            doStop (id, index) {
                let url = this.baseURL + '/stop/' + id
                this.$ajax.post(url).then(r => {
                    let {code, msg} = r.data
                    if (code === 0) {
                        this.$bus.alert('success', '已停止')
                        this.data[index].status = 2
                    } else {
                        this.$bus.alert('error', msg)
                    }
                })
            },
            replace (row) {
                if (row.status === 0) {
                    this.data1 = []
                    this.selectRow = row
                    this.$refs.projectList.refresh()
                    this.showModal = true
                } else {
                    this.$bus.alert('warning', '不符合更换条件')
                }
            },
            selectProject (row) {
                row.quantity = 1
                this.data1.push(row)
            },
            remove (index) {
                this.data1.splice(index, 1)
            },
            doReplace () {
                if (this.data1.length > 0) {
                    let url = this.baseURL + '/replace'
                    this.$ajax.post(url, {
                        id: this.selectRow.id,
                        datas: JSON.stringify(this.data1)
                    }).then(r => {
                        let {code, data, msg} = r.data
                        if (code === 0) {
                            this.$bus.alert('success', '已更换')
                            this.showModal = false
                            this.data = data
                        } else {
                            this.$bus.alert('error', msg)
                        }
                    })
                } else {
                    this.$bus.alert('warning', '请选择要更换项目')
                }
            }
        }
    };
</script>